import React from 'react';
import { Tooltip } from 'antd';
import { SyncOutlined, ColumnHeightOutlined, SettingOutlined } from '@ant-design/icons';
import styles from './index.less';

export default ({ header }) => {
  const { headerTitle, isHeaderToolsRender } = header;

  return (
    <div className={styles.tableToolsContainer}>
      <div className={styles.tableToolsHeader}>
        <span className={styles.tableToolsHeaderText}>{headerTitle || ''}</span>
      </div>
      <div className={styles.tableToolsContent}>
        {isHeaderToolsRender && (
          <div className={styles.tableToolsContentFixedItem}>
            <div className={styles.toolList}>
              <Tooltip placement="top" title="刷新">
                <span className={styles.toolItem}>
                  <SyncOutlined />
                </span>
              </Tooltip>
              <Tooltip placement="top" title="密度">
                <span className={styles.toolItem}>
                  <ColumnHeightOutlined />
                </span>
              </Tooltip>
              <Tooltip placement="top" title="列设置">
                <span className={styles.toolItem}>
                  <SettingOutlined />
                </span>
              </Tooltip>
            </div>
          </div>
        )}
      </div>
    </div>
  );
};
